{% extends 'base.html' %}
{% load static %}

{% block script %}
    <script src="{% static 'logs/js/logs_schedule.js' %}"></script>
    <script type="text/javascript">
        $(function () {
            $('[data-toggle="tooltip"]').tooltip()
        })
    </script>
{% endblock %}

{% block content %}
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-12">
                <div class="row justify-content-md-center mb-4">
                    <div class>
                        <h2 class="text-center"><span class="text-black-50">{{ month|date:'Y年m月' }}</span> 值班表</h2>
                    </div>
                </div>

                <div class="row">
                    {% now 'Ym' as now_month %}
                    {% now 'Y' as current_y %}
                    {% now 'm' as current_m %}
                    <div class="col-4 mb-2">
                        {% if month|date:'Ym' == now_month %}
                            <a class="btn btn-success disabled" href="{% url 'schedule_by_month' current_y current_m %}">本月值班表
                            </a>
                        {% else %}
                            <a class="btn btn-primary" title="查看{% now 'Y年m月' %}值班表"
                               data-toggle="tooltip" data-placement="top"
                               href="{% url 'schedule_by_month' current_y current_m %}">查看本月值班表 </a>
                        {% endif %}
                    </div>
                    <div class="btn-group col-4 mb-2 justify-content-center">
                        <a class="btn btn-outline-primary"
                           title="查看{{ previous_month|date:'Y年m月' }}值班表"
                           data-toggle="tooltip" data-placement="top"
                           href="{% url 'schedule_by_month' previous_month|date:'Y' previous_month|date:'m' %}">上一个月</a>
                        <a class="btn btn-outline-primary"
                           title="查看{{ next_month|date:'Y年m月' }}值班表"
                           data-toggle="tooltip" data-placement="top"
                           href="{% url 'schedule_by_month' next_month|date:'Y' next_month|date:'m' %}">下一个月</a>
                    </div>
                    <div class="col-4 text-right mb-2">
                        {% if month|date:'Ym' == now_month or previous_month|date:'Ym' == now_month %}
                            {% if not schedule_list %}
                                <a class="btn btn-primary" title="创建{{ month|date:'Y年m月' }}值班表"
                                   data-toggle="tooltip" data-placement="top"
                                   href="{% url 'bulk_create_schedule_by_month' month|date:'Y' month|date:'m' %}">创建值班表</a>
                            {% endif %}
                        {% else %}
                            <a class="btn btn-outline-secondary disabled">创建值班表</a>
                        {% endif %}
                    </div>
                </div>

                <table id="schedule-table" class="table table-striped table-hover mb-4">
                    <caption>{{ month|date:'Y年m月' }}值班表</caption>
                    <thead class="thead-dark">
                    <tr class="row mx-0">
                        <th scope="row" class="col-3">值班日期</th>
                        <th scope="row" class="col-2">安排值班人</th>
                        <th scope="row" class="col-2">实际值班人</th>
                        <th scope="row" class="col-2">状态</th>
                        <th scope="row" class="col-2">操作</th>
                        <th scope="row" class="col-1">管理员</th>
                    </tr>
                    </thead>
                    <tbody>
                    {% include 'logs/includes/partial_schedule_list.html' %}
                    </tbody>
                </table>
            </div>
        </div>
        <!-- modal-sign-in -->
        <div class="modal fade" id="modal-sign-in">
            <div class="modal-dialog">
                <div class="modal-content">
                </div>
            </div>
        </div>
    </div>
{% endblock %}

